﻿@using xConnected.Common.CompanyProfile
@using xConnected.Common.Login
@using xConnected.Common.ExpertProfile
@using xConnected.Common.Project
<div class="alert alert-info">
    <div align="center">@CompanyProfile.ClickThePartsOfYourProfileThatYouWantToEdit <a href="#" class="btn btn-info" data-bind="click: function() { $root.company.SaveOrUpdate(); }">@CompanyProfile.DoneEditing</a></div>
</div>
<div class="alert alert-error" data-bind="visible: $root.company.alertVisible">
    <div align="center">Please fill out the mandatory fields bellow</div>
</div>
<div data-bind="with: company">
    <div data-bind="with: workingCompany">
        <div class="well">
            <div class="row-fluid">
                <a class="span3" data-toggle="modal" href="#PhotoCompanyDialog"><img class="img-rounded" data-bind="attr: {src: $data.Photo150X150()}, click:function() { $root.company.dropPhoto(); }" alt="Photo"/></a>
                <a data-toggle="modal" href="#NameCompanyDialog" data-bind="click: function() { $root.company.selectName(); }">
                    <span class="span4" data-bind="visible: $root.company.nameVisible"><strong>@Resources.Name *</strong></span>
                    <h3 style="font-size: large; font-weight: bold" data-bind="text: Title" class="span6"></h3>
                </a>
                <a data-toggle="modal" href="#DescriptionCompanyDialog" data-bind="click: function() { $root.company.selectDescription(); }">
                    <span class="span4" data-bind="visible: $root.company.descriptionVisible"><strong>@Resources.Description *</strong></span>
                    <span data-bind="html: Description" class="span6"/>
                </a>
            </div>
        </div>
        <span style="font-size: smaller">Fields marked with * are mandatory</span>
        <hr/>
        <span style="font-size: large; margin-top: 20px">About us</span>
        <hr/>
        <a class="row-fluid" data-toggle="modal" href="#TagLineCompanyDialog" data-bind="click: function() { $root.company.selectTagLine(); }">
            <span class="span4"><strong>@CompanyProfile.TagLine *</strong></span>
            <span data-bind="text: TagLine" class="span6"/>
        </a>
        <a class="row-fluid" href="#" data-bind="click: function() { $root.company.selectCountry(); }">
            <span class="span4"><strong>@CompanyProfile.Country *</strong></span>
            <span class="span6" data-bind="with:Country"><span data-bind="text:Description"></span></span>
        </a>
        <a class="row-fluid" data-toggle="modal" href="#AddressCompanyDialog" data-bind="visible: $root.company.locationVisible, click: function() { $root.company.selectAddress(); }">
            <span class="span4"><strong>@Resources.Location *</strong></span>
            <span data-bind="text: Location" class="span6"></span>
        </a>
    </div>
    <div data-bind="visible: $root.company.locationMapVisible" style="height: 150px; width: 250px; margin-left: 298px; margin-bottom: 10px" id="addressCompanyEditMode"></div>
    <div data-bind="with: workingCompany">
        <a class="row-fluid" href="#" data-bind="click: function(){$root.company.selectIndustry(); }">
            <span class="span4"><strong data-bind="popover: {title: 'Pay attention!', content: 'You need to select first Industry, so you can than select Categories and/or Technologies.', placement: 'right', trigger: 'hover', delay{show: 500, hide: 100}">Industry *</strong></span>
            <span class="span6" data-bind="with: Industry"><span data-bind="text: Description"></span></span>
        </a>
        <a class="row-fluid" data-toggle="modal" href="#CategoriesCompanyDialog" data-bind="visible: $root.company.categoriesTechnologiesVisible, click: function() { $root.company.selectCategories(); }">
            <span><strong class="span4">@Resources.Categories</strong></span>
            <span data-bind="foreach: Categories"class="btn-toolbar">
                <span style="margin-left: 20px" class="btn-group" ><button class="btn btn-mini" data-bind=" text: Description"></button></span>
            </span>
        </a>
        <a class="row-fluid" data-toggle="modal" href="#TechnologiesCompanyDialog" data-bind="visible: $root.company.categoriesTechnologiesVisible, click: function() { $root.company.selectTechnologies(); }">
            <span><strong class="span4">@ProjectRes.Technologies</strong></span>
            <span data-bind="foreach: Technologies"class="btn-toolbar">
                <span style="margin-left: 20px" class="btn-group"><button class="btn btn-mini" data-bind=" text: Name"></button></span>
            </span>
        </a>
        <hr/>
        <span style="font-size: large; margin-top: 20px">Contact information</span>
        <hr/>       
        <a class="row-fluid" data-toggle="modal" href="#PhoneNumberCompanyDialog" data-bind="click: function() { $root.company.selectPhoneNumber(); }">
            <span class="span4"><strong>Phone number *</strong></span>
            <span data-bind="text: PhoneNumber" class="span6"/>
        </a>
        <a class="row-fluid" data-toggle="modal" href="#EmailCompanyDialog" data-bind="click: function() { $root.company.selectEmail(); }">
            <span class="span4"><strong>@Login.Email *</strong></span>
            <span data-bind="text: Email" class="span6"></span>
        </a>
        <a class="row-fluid" data-toggle="modal" href="#WebsiteCompanyDialog" data-bind="click: function() { $root.company.selectWebsite(); }">
            <span class="span4"><strong>@CompanyProfile.Website *</strong></span>
            <span data-bind="text: Website" class="span6"/>
        </a>
        <hr/>
    </div>
    <hr/>
</div>
<div class="alert alert-info">
    <div align="center"><a href="#" class="btn btn-info" data-bind="click: function() { $root.company.SaveOrUpdate(); }">@CompanyProfile.DoneEditing</a></div>
</div>
<div data-bind="with: company">
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Country")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/CountryUpdate")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Description")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Name")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Tagline")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Website")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Email")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/PhoneNumber")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Industry")
     @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/IndustryUpdate")
    @Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Categories")
</div>
@Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Photo")
@Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Address")
@Html.Partial("MyAccount/Partial/MyCompanyProfiles/EditMode/Technologies")